import Vue from "vue";
import Router from "vue-router";

Vue.use(Router);

const routes = [
  {
    path: "/",
    name: "HOME",
    component: () => import("@/pages/home.vue"),
    meta: {
      title: "介绍",
      titleEn: "Introduce"
    }
  },
  {
    path: "/button",
    name: "BUTTON",
    component: () => import("@/pages/button/index.vue"),
    meta: {
      title: "按钮",
      titleEn: "Button"
    }
  },
  {
    path: "/checkbox",
    name: "CHECKBOX",
    component: () => import("@/pages/checkbox"),
    meta: {
      title: "多选框",
      titleEn: "Checkbox"
    }
  },
  {
    path: "/date-pick",
    name: "DTAEPICK",
    component: () => import("@/pages/date-pick"),
    meta: {
      title: "日期选择器",
      titleEn: "Date-Pick"
    }
  },
  {
    path: "/dialog",
    name: "DIALOG",
    component: () => import("@/pages/dialog"),
    meta: {
      title: "对话框",
      titleEn: "Dialog"
    }
  },
  {
    path: "/dropdown",
    name: "dropdown",
    component: () => import("@/pages/dropdown"),
    meta: {
      title: "下拉菜单",
      titleEn: "Dropdown"
    }
  },
  {
    path: "/input",
    name: "input",
    component: () => import("@/pages/input"),
    meta: {
      title: "输入框",
      titleEn: "Input"
    }
  },
  {
    path: "/message",
    name: "message",
    component: () => import("@/pages/message"),
    meta: {
      title: "消息提示",
      titleEn: "Message"
    }
  },
  {
    path: "/notification",
    name: "notification",
    component: () => import("@/pages/notification"),
    meta: {
      title: "通知",
      titleEn: "Notification"
    }
  },
  {
    path: "/popover",
    name: "popover",
    component: () => import("@/pages/popover"),
    meta: {
      title: "弹出框",
      titleEn: "Popover"
    }
  },
  {
    path: "/pop-confirm",
    name: "pop-confirm",
    component: () => import("@/pages/popconfirm"),
    meta: {
      title: "弹出确认框",
      titleEn: "Pop-Confirm"
    }
  },
  {
    path: "/radio",
    name: "radio",
    component: () => import("@/pages/radio"),
    meta: {
      title: "单选框",
      titleEn: "Radio"
    }
  },
  {
    path: "/select",
    name: "select",
    component: () => import("@/pages/select"),
    meta: {
      title: "下拉选择器",
      titleEn: "Select"
    }
  },
  {
    path: "/switch",
    name: "switch",
    component: () => import("@/pages/switch"),
    meta: {
      title: "开关",
      titleEn: "Switch"
    }
  },
  {
    path: "*",
    redirect: "/",
    meta: {
      ignore: true
    }
  }
];

const route = new Router({ scrollBehavior: () => ({ y: 0 }), routes });

route.afterEach((to, from, next) => {
  document.title = "awosome-ui " + to.meta.title;
  let scrollDom = document.querySelector("#app-main");
  if (scrollDom) {
    scrollDom.scrollTop = 0;
  }
});

export default route;

export { routes };
